Skip to content

Vue 3 Upgrade #1900

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 10 commits into
base: main
Choose a base branch
from
Open

Vue 3 Upgrade #1900

wants to merge 10 commits into from

Conversation

GrahamSH-LLK
Copy link

@GrahamSH-LLK GrahamSH-LLK commented Apr 15, 2025

Description

Upgrades to Vue 3 and necessary associated dependencies. This makes as few changes as required in order to lower review overhead and potential for breakage.

Closes #885

Meta

Merge checklist:

  • Pull Request title is short, imperative summary of proposed changes
  • The description documents the what and why
  • If this PR changes behavior or adds a feature, user documentation is updated
  • If this PR touches photon-serde, all messages have been regenerated and hashes have not changed unexpectedly
  • If this PR touches configuration, this is backwards compatible with settings back to v2024.3.1
  • If this PR touches pipeline settings or anything related to data exchange, the frontend typing is updated
  • If this PR addresses a bug, a regression test for it is added

@GrahamSH-LLK GrahamSH-LLK requested a review from a team as a code owner April 15, 2025 01:50
@GrahamSH-LLK GrahamSH-LLK changed the title Nearly functional vue3 upgrade Vue 3 Upgrade Apr 15, 2025
Copy link
Member

@samfreund samfreund left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There are a few things I know don’t work:

  • font is broken
  • compact mode expands too far vertically
  • some table styling is off
  • the camera view header is a little broken
  • settings page colors are wonky
  • the camera feed is far too small
    image
  • I can't select a pipeline type 💀

@GrahamSH-LLK
Copy link
Author

There are a few things I know don’t work:

  • font is broken
  • compact mode expands too far vertically
  • some table styling is off
  • the camera view header is a little broken
  • settings page colors are wonky
  • the camera feed is far too small
    image
  • I can't select a pipeline type 💀

All of these are fixed except for the stream being too small.

Copy link
Member

@samfreund samfreund left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

image
Both of these should be actual buttons, not just text.

Targets shouldn't be a tab, it should always be visible on the side.

image
This is a little hard to read.

The font is also still different, but idk how important that is.

Enabling driver mode with any tab other than input selected means the input tab is not shown for driver mode. (Reloading does resolve this)

Grayed out buttons are really light, should be darker
image
more like this

@samfreund samfreund mentioned this pull request Apr 15, 2025
12 tasks
Copy link
Contributor

@Gold856 Gold856 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Sidebar font is a little small, let's increase that for readability
I'm not sure how I feel about the text color for selected options being blue on blue. That seems to be bad for readability/accessibility.
Log toggles are unaligned:
image
The log text is also really contrasting. I like the readability, but it might be hard on the eyes?
Also, all modals make the background lighter instead of darker. It's a change, but I'm not necessarily against it. I do think it's messing with my perception though, because I keep thinking that the modal color is darker than the normal UI (likely because the modal background is lighter, so of course I perceive it as darker.) It's kinda jarring.
Save and Close buttons need more contrast:
image
None of sliders seem to work for me? Sliding doesn't work, and inputting the numbers don't cause updates either.
I don't like how buttons that can't be clicked like the 3d toggle or cancel calibration button are lighter. "Grayed out" is a term that people use to describe these buttons.
Buttons here need some contrast to show you can interact with them:
image
Disabled save button color is bad, the old one was nicer (kinda contradicts what I said before, but I think it is just better):
image
Inconsistent size here isn't great:
image
A bit too much padding here:
image
The older, more compact style was good.

@samfreund
Copy link
Member

samfreund commented Apr 16, 2025

Sliders worked fine for me, but I tested prior to the updates to the sliders.

Edit: further testing indicates sliders are indeed borked, likely caused by this commit

@samfreund
Copy link
Member

samfreund commented Apr 21, 2025

Seems to be mostly good.

  1. Linting
  2. It needs to be more clear which buttons are deactivated, but still able to be selected.
    image

@samfreund
Copy link
Member

Also, FPS is being reported incorrectly as 0.

@Gold856
Copy link
Contributor

Gold856 commented Apr 21, 2025

Log level toggles are still unaligned and the log levels aren't color coded:
image

@samfreund
Copy link
Member

image
This text shouldn't be truncated

@Gold856
Copy link
Contributor

Gold856 commented Apr 21, 2025

Also, switching between various tabs sees to cause the main UI view to blank out:
image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Update PhotonClient to use Vue@3
3 participants